import { CSSProperties } from 'vue'
import { createElement } from '@/utils/dom'
import docxDefaultConfig, {
  DefaultDocxConfig
} from '@/config/docx-default-config'
import { pureRichTextExportDocx, pureRictTextToBlob } from '../docx'

type DocxConfigAbstarct = Partial<Omit<DefaultDocxConfig, 'a4'>>

function createGenUtils(config?: DocxConfigAbstarct) {
  const docxConfig = config || docxDefaultConfig

  return {
    // 标题
    createTitle(text: string, style?: CSSProperties) {
      return createHtmlNode(
        'h1',
        mergeConfig(docxConfig.title || {}, style),
        text
      )
    },
    // h1
    createHeading1(text: string, style?: CSSProperties) {
      return createHtmlNode(
        'h1',
        mergeConfig(docxConfig.HEADDING_1 || {}, style),
        text
      )
    },
    // h2
    createHeading2(text: string, style?: CSSProperties) {
      return createHtmlNode(
        'h2',
        mergeConfig(docxConfig.HEADDING_2 || {}, style),
        text
      )
    },
    // h3
    createHeading3(text: string, style?: CSSProperties) {
      return createHtmlNode(
        'h3',
        mergeConfig(docxConfig.HEADDING_3 || {}, style),
        text
      )
    },
    // 正文
    createMainBody(text, style?: Record<string, any>) {
      return createHtmlNode(
        'p',
        mergeConfig(docxConfig.body || {}, {
          textIndent: '2em',
          ...(style || {})
        }),
        text
      )
    },
    appendChild(container: HTMLElement, el: HTMLElement) {
      container.appendChild(el)
    }
  }
}

interface IParams {
  styleConfig?: DocxConfigAbstarct
}

function createGenerateDocxHtml(params?: IParams) {
  const { styleConfig } = params || {}

  const container = document.createElement('p')
  function apt(node) {
    container.appendChild(node)
  }

  function toString() {
    return container.innerHTML.toString()
  }

  const createUtils = createGenUtils(styleConfig)

  return {
    toString,
    getContainer() {
      return container
    },
    appendChild: apt,
    nextLine() {
      apt(createElement('br', {}, ''))
    },
    // 标题
    createTitle(text: string, style?: CSSProperties) {
      return apt(createUtils.createTitle(text, style))
    },
    // h1
    createHeading1(text: string, style?: CSSProperties) {
      return apt(createUtils.createHeading1(text, style))
    },
    // h2
    createHeading2(text: string, style?: CSSProperties) {
      return apt(createUtils.createHeading2(text, style))
    },
    // h3
    createHeading3(text: string, style?: CSSProperties) {
      return apt(createUtils.createHeading3(text, style))
    },
    // 正文
    createMainBody(text = '', style?: CSSProperties) {
      return apt(createUtils.createMainBody(text, style))
    },
    // 正文
    createMainBodyText(text = '', style?: CSSProperties) {
      return apt(
        createElement(
          'span',
          { style: mergeConfig(docxDefaultConfig.body, style) },
          text
        )
      )
    },

    joinHtmlString(htmlStr: string) {
      container.innerHTML = container.innerHTML + htmlStr
    },
    download(filename?: string) {
      pureRichTextExportDocx(toString(), filename)
    },
    toBlob() {
      return pureRictTextToBlob(toString())
    }
  }
}

function mergeConfig(
  target: Record<string, any>,
  source?: Record<string, any>
) {
  return Object.assign({}, target, source)
}

function createHtmlNode(tagName, style, text) {
  return createElement(
    tagName,
    {
      style
    },
    text
  )
}

export default createGenerateDocxHtml
